import { ChangeDetectionStrategy, Component } from '@angular/core';

@Component({
  selector: 'app-demo-grid-align',
  templateUrl: './flex-align.component.html',
  styles: [
    `
      .grid-demo h3 {
        margin: 16px 0;
      }
      .grid-demo h3:first-child {
        margin-top: 0;
      }
      .grid-demo .lv-row {
        background-color: #f2f2f2;
      }
      .grid-demo .lv-row .lv-col p {
        color: #fff;
        text-align: center;
        background-color: #2673e5;
      }
      .grid-demo .lv-row .lv-col:nth-child(2n) p {
        background-color: #1359bf;
      }
      .height-100 {
        height: 100px;
        line-height: 100px;
      }
      .height-50 {
        height: 50px;
        line-height: 50px;
      }
      .height-120 {
        height: 120px;
        line-height: 120px;
      }
      .height-80 {
        height: 80px;
        line-height: 80px;
      }
    `,
  ],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class FlexAlignComponent {}
